<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>

  <script>
    let xhr = new XMLHttpRequest();
    //设置响应体的格式
    xhr.responseType = 'json';

    xhr.open('get', '/api');

    xhr.send();

    xhr.onreadystatechange = function(){
      if(xhr.readyState === 4){
        if(xhr.status >= 200 && xhr.status < 300){
          //请求成功
          // console.log(xhr.response);
          //创建一个 h2 元素
          let h2 = document.createElement('h2');
          //设置h2 的文本内容
          h2.innerHTML = xhr.response.title;
          //创建一个 img 元素
          let img = document.createElement('img');
          //设置 img 的 src 属性
          img.src = xhr.response.img;
          //将 h2 和 img 插入到文档中
          document.body.append(h2);
          document.body.append(img);
        }
      }
    }

  </script>
</body>
</html>